<link type="text/css" href="https://cdn.bootcdn.net/ajax/libs/weui/0.4.3/style/weui.min.css" rel="stylesheet">
<link type="text/css" href="https://cdn.bootcdn.net/ajax/libs/jquery-weui/1.2.1/css/jquery-weui.min.css" rel="stylesheet">
<script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery-weui/0.8.3/js/jquery-weui.min.js"></script>



<!-- 框架的组件文档 "http://old.jqweui.com/components#searchbar" -->
<div class="weui_search_bar" id="search_bar" style="height: 45px;">
	<form class="weui_search_outer">
		<div class="weui_search_inner">
			<i class="weui_icon_search"></i>
			<input type="search" class="weui_search_input" id="search_input" placeholder="搜索" required/>
			<a href="javascript:" class="weui_icon_clear" id="search_clear"></a>
		</div>
		<label for="search_input" class="weui_search_text" id="search_text">
			<i class="weui_icon_search"></i>
			<span>搜索</span>
		</label>
	</form>
	<a href="javascript:" class="weui_search_cancel" id="search_cancel">取消</a>
</div>

<script type="text/javascript">
	//获取搜索框
	var search=$('.weui_search_inner input[type="search"]');
	//监听改变事件
	search.change(function(){
		console.log('change');
		//dosomething
	})
</script>